<html> 

<head> 
<meta charset="utf-8">

</head> 
<style type="text/css">
	#q {
		width: 200px;
		
		background-color: #000;
		height: 300px;
	}
	#w {
		width: 200px;
		
		background-color: #000;
		height: 300px;
	}
</style>
<body> 
<div id="q" onmouseover="over(event)">
</div>
<div style="width:300px;height:10px;"></div>
<div id="w" onmousemove="move(event)">
</div>
</body> 
<script type="text/javascript"> 
function over(event) 
{ 
  
       var v = document.getElementById('q');  
       if(v.offsetWidth < 1000)
       	{v.style.width = v.offsetWidth + 20;}  
        
    
} 
function move(event) 
{ 
  var v = document.getElementById('w');  
       if(v.offsetWidth < 1000)
       	{v.style.width = v.offsetWidth + 2;}
}
</script> 
</html> 
